@extends("admin.layouts.main")
<style>
  .input-group > .form-control{
  }
  .input-group > .form-control{
  }
  .sendPic{
    width:120px;
    height:120px;
    border:1px dotted gray;
    line-height: 120px;
    text-align: center;
    box-shadow: 0 0 2px gray;
    cursor:pointer;
  }
  .zhifu{
  }
  .myImg{
  }
</style>
@section("content")
<div class="container-fiuld p-3">
  <div class="card w-75">
    <div class="card-header border-0 d-flex flex-column-reverse">
      <h3>提现设置</h3>
    </div>
    <div class="card-body w-50">
      <form>
        <div class="input-group mb-3">
          <div class="input-group-prepend">
            <span class="input-group-text">提现联系人手机号</span>
          </div>
          <input type="text" class="form-control" placeholder="（请填写真实号码）" id="mobile" value="@if($withdrawal) {{$withdrawal->mobile}} @endif">
        </div>
        <div class="input-group mb-3">
          <div class="input-group-prepend">
            <span class="input-group-text">支付宝账号</span>
          </div>
          <input type="text" class="form-control" placeholder="（请填写真实的支付宝账号）" id="ali" value="@if($withdrawal) {{$withdrawal->alipay}} @endif">
        </div>
        <div class="input-group mb-3">
          <div class="input-group-prepend">
            <span class="input-group-text">支付宝姓名</span>
          </div>
          <input type="text" class="form-control" placeholder="（与代理商老板一致的开户名）" id="name" value="@if($withdrawal) {{$withdrawal->name}} @endif">
        </div>
        <div class="row layui-upload">
          <div class="col-lg-3">
            <button type="button" class="layui-btn" id="test1" style="display:@if($withdrawal)none;@endif ">上传二维码图片</button>
          </div>
          <div class="col-lg-3">
            <div class="layui-upload-list mt-0">
              <img class="layui-upload-img"  id="demo1" style="width:120px;height:120px;margin-left:50%;" src="@if($withdrawal) {{$withdrawal->payment_img}} @else{{""}} @endif">
              <p id="demoText"></p>
              <input name="B_Url" type="hidden" value=""/>
            </div>
          </div>
        </div>
        <button type="button" class="ml-5 btn btn-primary " id="filter" style="display:@if($withdrawal)none;@endif " >提交</button>
        <button type="button" class="btn btn-secondary " style="display:@if($withdrawal)none;@endif ">取消</button>
      </form>
      <div class="alert alert-info mt-3">
        <strong>信息!</strong> 上传后不可自行修改，如需修改请联系专属客服
      </div>
    </div>
  </div>
</div>
@endsection

@section("js")
<script>
  layui.use('upload', function() {
    var $ = layui.jquery,upload = layui.upload;
    //将上传的图片转为base64
    var uploadInst = upload.render({
      elem: '#test1',
      url: "",
      type: "POST",
      before: function(obj) {
        //传路径并且将其转为base64
        obj.preview(function(index, file, result) {
          $('#demo1').attr('src', result);
        })
      },
      done: function(res) {
        if (res.code > 0) {
          return layer.msg('上传失败');
        }
      },
      done: function(fileName) {
        $('[Name=B_Url]').val(fileName.src);
      },
      error: function() {
        var demoText = $('#demoText');
      }
    })
    // 提交
    $("#filter").click(function() {
      var $img = $("#demo1").attr('src');
      var $mobile = $("#mobile").val();
      var $ali = $('#ali').val();
      var $name = $('#name').val();
      $.ajax({
        type: 'post',
        url: "{{ route('upload') }}",
        data: {
          mobile: $mobile,
          ali: $ali,
          name: $name,
          center_imgt: $img
        },
        success: function(res) {
          if (res.code == 0) {
            layer.msg('提交成功', { icon: 1 });
              window.location="{{route('withdrawal')}}";

          } else {
            layer.msg(res.exception, { icon: 1 });
          }
        },
        error: function(err) {
          layer.msg('提交失败', { icon: 5 });
          $(".btn.btn-primary").html("提交")
          console.log(err)
        }
      })
    })
  })
</script>
@endsection
